<template>
	<view class="main_container">
		<u-row customStyle="padding-left: 5vw; padding-right: 5vw;" justify="space-around">
			<u-col span="1">
				<u--image :src="user.avatar_url" width="40px" height="40px" shape="square" radius="15" />
			</u-col>
			<u-col span="10">
				<view class="bg_img2"> {{user.nickname}} </view>
			</u-col>
		</u-row>
		<view style="height: 10px;" />
		<view class="bg_img">
			<view class="message">
				<u-text :text="message" color="#0a235c" size="14" lineHeight="19px"/>
				<view style="height: 20px;" />
<!-- 				<u-scroll-list v-if="image_src_list.length">
					<view v-for="image_src in image_src_list" style="padding-right: 10px; padding-top: 5px;">
						<u-image width="32vw" height="20vw" radius="5px" :src="image_src"></u-image>
					</view>
				</u-scroll-list> -->
				<u-album :urls="image_src_list"></u-album>
			</view>
		</view>
		<hb-comment ref="hbComment" @add="addComment" @like="like" @del="like" :deleteTip="'确认删除？'" :cmData="commentData"/>
	</view>
</template>

<script>
	// const test_posts = require('@/static/test-posts.json')
	import {build_commentList, like, add_comment} from '@/static/post_comment.js'
	export default {
		name:"post_message",
		onShareAppMessage(res) {
			let cur_page = getCurrentPages()
			cur_page = cur_page[cur_page.length - 1]
			return {
				title: "帖子",
				path: cur_page.$page.fullPath
			}
		},
		data() {
			return {
				post: null,
				message: "",
				commentData: [],
				image_src_list: [],
				user: {
					nickname: "",
					avatar: "",
				},
			};
		},
		onLoad(options) {
			console.log(options)
			this.post = options.id
			this.add().then(c => {
				console.log(c)
				this.message = c.message
				this.image_src_list = c.image_src_list
				this.user  = c.user
			})
			
			build_commentList(this.post)
			.then(res => this.commentData = res)	
		},
		methods: {
			addComment(t) {
				add_comment(t, this.post).then(res => {
					this.commentData = res
					this.$refs.hbComment.addComplete()
				})
			},
			close_popup() {
				this.show_popup = false
			},
			async add() {
				let cur_post;
				try {
					cur_post = await uni.request({
						url: getApp().globalData.base_url + "/get/post_message/" + this.post
					})
				} catch (error) {
					throw error
				}
				return cur_post.data;
			},
		}
	}
</script>

<style lang="scss">
	.main_container {
		width: 100vw;
		padding-bottom: 20px;
		.bg_img {
			margin: 0 auto;
			width: 90vw;
			padding: 2px;	
			// background: linear-gradient(to right, #aaaaff, #ffffff);
			border-radius: 17px;
			.message {
				min-height: 300px;
				margin: 0 auto;
				border: 2px;
				border-radius: 15px;
				padding: 15rpx;
				padding-top: 12rpx;
				background-color: rgb(231, 237, 254);
			}
		}
		.bg_img2 {
			width: 100%;
			height: 45px;
			color: #550000;
			font-size: 16px;
			padding-left: 10px;
			line-height: 43px;
			background-color: rgb(255, 255, 255);
			border-radius: 17.5px;
		}
	}
</style>